<template>
  <div v-if='isExpert'>
    <template v-if="reviewStageCode == 2">
      <el-descriptions :column="2" size="large">
        <el-descriptions-item label-class-name="right-align" label='项目名称:'>
          <span class="text--info subtext">{{projectInfo.projectName}}</span>
        </el-descriptions-item>

        <el-descriptions-item label-class-name="right-align" label='评审项目阶段:'>
          <span class="text--info subtext">{{projectInfo.reviewStageName}}</span>
        </el-descriptions-item>

        <div v-for='item in reviewInfoList' :key="item.value">
          <el-descriptions-item label-class-name="right-align" :label='item.label+"："' v-if='item.type === "file"'>
            <div v-if="peojectDetailData[item.value]?.length" class="file-wrap">
              <p
                class="text--info download-link subtext"
                v-for="(obj, index) in peojectDetailData[item.value]"
                :key="index"
                @click.prevent="handlePreview(obj)"
              >
                <el-link :underline="false" icon="el-icon-folder">{{ obj?.fileName }}</el-link>
              </p>
            </div>

            <div class="text--info subtext file-wrap" v-else> - </div>
          </el-descriptions-item>

          <el-descriptions-item label-class-name="right-align" :label='item.label+"："' v-else>
            <span class="text--info subtext">{{projectInfo[item.value] || "-"}}</span>
          </el-descriptions-item>
        </div>
      </el-descriptions>
    </template>
  </div>
</template>

<script lang="ts">
import { defineComponent,ref, watch } from "vue";
import { flowFormArray } from "/@/utils/flowForm";
export default defineComponent({
  props: {
    projectInfo: {
      type: Object,
      default:()=>{}
    },
    peojectDetailData:{
      type: Object,
      default:()=>{}
    }
  },

  setup(props, {}) {
    const reviewInfoList = ref([]);
    const reviewStageCode = ref<boolean>(2);
    const isExpert = ref<boolean>(false);
    const handlePreview = (item: any) => {
      if (item.response) {
        window.open(
          `${location.origin}${location.pathname}#/online?uuidFile=${item?.response.data.uuidFile}&fileName=${item?.response.data.fileName}`
        );
      } else {
        window.open(
          `${location.origin}${location.pathname}#/online?uuidFile=${item.uuidFile}&fileName=${item.fileName}`
        );
      }
    };
    watch(
      () => props.projectInfo,
      newVal => {
        const flowType = props?.projectInfo.flowType;
        if(flowType){
          isExpert.value = flowFormArray[flowType]?.reviewInfo["isExpert"];
          if(isExpert.value){
            // 专家评审阶段:2:立项,3:实施,4:验收,5:后评价,6:变更,7:中止
            reviewStageCode.value = props?.projectInfo.reviewStageCode
            reviewInfoList.value = flowFormArray[flowType]?.reviewInfo[reviewStageCode.value]
          }
          else{
            reviewInfoList.value = flowFormArray[flowType].reviewInfo?.reviewList
          }
        }
      }
    );

    return {
      isExpert,
      reviewStageCode,
      reviewInfoList,
      handlePreview
    }
  }
});
</script>

<style lang="scss" scoped>
.file-wrap{
  display: inline-block;
  vertical-align: top
}
</style>
